<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <!-- 元素隐藏 -->
    display: none; 隐藏元素,且不占位置
    display: block; 元素显示
    配合hover可以实现隐藏显示图片

    <!-- 精灵图 -->
    background: url(./images/abcd.jpg) no-repeat -387px -141px;
    选择图片 并且选定位置 例-387px -141px

    <!-- 字体图标 -->
    css中要有字体的地址,之后在字体图标的位置要表明字体
    例: font-family:'iconfont';

    如果已经link了字体文件,那可以直接加<i class='class字体名字  iconfont'></i>>

    <!-- 鼠标指针图标 -->
    <li style="cursor: default;"> default 默认箭头</li>
    <li style="cursor: pointer;"> pointer 手指箭头</li>
    <li style="cursor: text;"> text 文本箭头</li>
    <li style="cursor: move;"> move 移动箭头</li>
    <li style="cursor: not-allowed;"> no-allowed 禁止图标</li>

    <!-- 图片文字对齐 -->
    vertical-align: middle;
    中线对齐,防止给字母预留基线空间上

</body>

</html>